<template>
    <div class="mfooter">
        <div class="footer-container">
            <div class="fix-right-layout">
                <div class="left-wrapper">
                    <div class="left-content">
                        <div class="column-layout">
                            <a href="#/"><img src="../../static/images/logo.png" class="main-logo"></a>
                        </div>
                        <div class="column-layout">
                            <div class="column-title">帮助中心</div>
                            <ul>
                                <li class="column-item">
                                    <a href="/help/yczt">预售演出</a>
                                </li>
                                <li class="column-item">
                                    <a href="/help/xz">关于座位</a>
                                </li>
                                <li class="column-item">
                                    <a href="/help/song">配送方式</a>
                                </li>
                                <li class="column-item">
                                    <a href="/help/wppf">无票赔付</a>
                                </li>
                                <li class="column-item">
                                    <a href="/help/tip">订票提示</a>
                                </li>
                            </ul>
                        </div>
                        <div class="column-layout">
                            <div class="column-title">关于我们</div>
                            <ul>
                                <li class="column-item">
                                    <a href="/contact">联系我们</a>
                                </li>
                                <li class="column-item">
                                    <a href="/contact">公司介绍</a>
                                </li>
                                <li class="column-item">
                                    <a href="/contact">问题反馈</a>
                                </li>
                            </ul>
                        </div>
                        <div class="column-layout">
                            <div class="column-title">支付方式</div>
                            <ul>
                                <li class="column-item">
                                    <div class="pay-item">
                                        <i class="icon
								 icon-ali-pay2"></i>
                                    </div>
                                </li>
                                <li class="column-item">
                                    <div class="pay-item">
                                        <i class="icon icon-weixin-pay2"></i>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="column-layout">
                            <div class="column-title">关注我们</div>
                            <ul>
                                <li class="column-item">
                                    <div class="pay-item">
                                        <a class="weixin">
                                            <i class="icon icon-wechat-icon"></i>
                                            微信公众号
                                            <div class="weixin-img">
                                                <img class="main-svg" src="">
                                                <img class="backup-png" src="">
                                            </div>
                                        </a>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
        <div class="copyright-content">
            <ul class="copyright">
                <span>Copyright©2018</span>
            </ul>
        </div>
        <BackTop></BackTop>
    </div>
</template>

<style scoped>
.mfooter {
  border-top: 1px solid #eeeeee;
  padding-top: 50px;
  background-color: #ffffff;
  margin-top: 30px;
}

.footer-container {
    display: table;
    margin: 0 auto;
    width: 1160px;
    border-bottom: solid 1px #efefef;
    padding-bottom: 55px
}

.footer-container .column-layout {
    width: 20%
}

.column-layout .column-title {
    padding-bottom: 10px;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .4px;
    color: #494949;
    padding-left: 65px;
    font-weight: 700
}

.column-layout .column-item {
    padding-bottom: 9px;
    font-size: 12px;
    color: #494949;
    padding-left: 65px
}

.column-layout .column-item a {
    color: #494949
}

.column-layout .column-item a:hover {
    color: #fd6857
}

.footer .fix-right-layout {
    float: left;
    width: 100%
}

.footer .fix-right-layout .left-wrapper {
    float: left;
    width: 100%;
    margin-left: -250px
}

.footer .fix-right-layout .left-content {
    width: auto;
    margin-left: 250px
}

.footer .fix-right-layout .right-content {
    width: 250px;
    float: left
}

.main-logo {
    margin-left: -120px;
    display: inline-block;
    vertical-align: middle;
}

.column-layout {
    float: left
}

.copyright-content {
    overflow: hidden;
    padding-bottom: 15px;
    width: 1160px;
    margin: 0 auto;
    font-size: 12px;
    color: #494949;
    line-height: 20px
}

.copyright-content .copyright {
    padding: 10px 0
}

.copyright-content a,.copyright-content span {
    font-size: 12px;
    color: #494949
}

.copyright-content img {
    width: 15px
}
</style>

<script>
export default {
  data() {
    return {};
  }
};
</script>